<div class="post">
    <div class="panel panel-default" style="background-color: #333; margin-bottom: 0px;">
        <div class="panel-heading" style="background-color: #bbd;">
            <h3 class="panel-title" style="text-align:left">
                Question 
                <% if(question.solved == '1') {%>
                    <span class="glyphicon glyphicon-ok" aria-hidden="true"></span> solved
                <% } %>
            </h3>
        </div>
        <div class="panel-body" style="text-align:left;">
            <div style="display:none;" id="questionId"><%= question._id %></div>
            <div id = "rcptHs" style="display:none;"><%= question.receipt %></div>
            <div style="font-size: 20px;">
                <p style="float:left;">
                    <%= question.title %>
                </p>
                <p style="float:right">
                    <span class="box"><%= question.pv %> Views</span>&nbsp&nbsp
                    <!-- <strong id="questionVal">
                        <% if(!question.receipt){ %>
                            0 
                        <% } else { %>
                            <%= Number(question.value)/1000000000000000000 %>
                        <% } %>
                        &nbsp<img src="/img/ethereum.svg" class="img-responsive" alt="user" style="width: 20px;float:right;margin-top:3px; margin-left: 5px;">
                </strong> -->
                </p>
            </div>
            <div style="clear:both;">
                <p>
                    <%- question.content %>
                </p>
<!--
                <% if(user) {%>
                    <% if(user._id == question.author._id){ %>
                        <% if(question.receipt){ %>
                        <p style="float:right; margin-top:15px;">
                            <button id = "bid" class="btn btn-default" disabled>Pay for asking</button>
                        </p>
                        <% }else{ %>
                        <div style="display: none;" id="user-account"><%= user.account %></div>
                        <p style="float:right; margin-top:15px;">
                            <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal" id="payforit">
                                Pay for asking
                            </button>
                       </p>
                       <% } %>
                <% }} %>
-->
            </div> 
        </div> 
    </div>
    <div class="panel-footer panel-footer-custom">
        By <%= question.author.username %>, created at <%= question.created_at %>
    </div> 
</div>
<div style="height: 20px"></div>
<div class="answers">
        <div class="panel panel-default" style="background-color: #333; margin-bottom: 0px;">
            <div class="panel-heading" style="background-color: #bbd;">
                <h3 class="panel-title" style="text-align:left">
                    Answers
                </h3>
            </div>
            <div class="panel-body" style="text-align:left;">
                    <% if(answers.length == 0){ %>
                        No answers yet! be the first one to answer this question.
                    <% } else { %>
                    <% answers.forEach(function(answer){ %>
                        <div class="answer-wrapper" id="answer">
                            <div class="answer-row">
                                <div class="answer-column">
                                    <div class="vote-panel">
                                        <div class="up-vote">
                                            <button class="btn btn-default upvote">
                                                <div id="id" style="display: none"><%= answer._id %></div>
                                                <span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>
                                            </button>    
                                        </div>
                                        <div class="votes" id="<%= answer._id %>"><%= answer.votes %></div>
                                        <div class="down-vote">
                                            <button class="btn btn-default downvote">
                                                <div id="id" style="display: none"><%= answer._id %></div>
                                                <span class="glyphicon glyphicon-chevron-down" aria-hidden="true"></span>
                                            </button>    
                                        </div>
                                        <% if(user.isAdmin){ %>
                                        <div class="like">
                                            <div class="liked">
                                                <div id="id" style="display: none"><%= answer._id %></div>
                                                <img src="/img/like.svg" class="img-responsive" alt="user" style="width: 20px;float:right;margin-top:3px; margin-left: 5px;">
                                            </div>   
                                        </div>
                                        <% } %>
                                    </div>
                                </div>
                                <div class="answer-column" style="padding-left: 20px; padding-top: 10px;">
                                    <div class="answer-panel">
                                        <div class="answer-content" style="margin-top: 20px;">
                                            <%- answer.content %>
                                        </div>
                                        <div class="user-info row">
                                            <img src="<%= answer.author.avatar %>" class="img-responsive" alt="user" style="width: 20px;">
                                            <span>
                                                <%= answer.author.username %>,
                                            </span>
                                            <span>
                                                answered at <%= answer.created_at %>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    <% }) %>
                    <% } %>
            </div>
        </div>
</div>
<div style="height: 20px"></div>
<div class="new-answer">
    <div class="panel panel-profile no-bg">
        <div class="panel-heading">
            <h2 class="panel-title heading-sm pull-left">
                Your Answer
            </h2>
        </div>
        <div class="panel-body">
            <form class="form_post" method="post" enctype="multipart/form-data" action="/piazza/<%= question._id %>/answer">
                <div class="form-group">
                    <div style="margin-bottom: 10px;">
                        <textarea type="text" class="form-control" name="content" id = "content" placeholder="New Post" rows="6"> </textarea>
                    </div>
                </div>
                <div class="form-group">
                    <div class="pull-left" style="margin-bottom: 10px;">
                        <button type="submit" class="btn btn-default">Post</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
      <div class="modal-content" style="background-color: #333; border: 1px solid #fff;">
        <div class="modal-header" style="color: #fff;text-align:left;">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title" id="myModalLabel">Pay to: 0x3d67a6bd741c2ca0c99dcaafc6b7f0e75726f41c</h4>
        </div>
        <div class="modal-body">
            <div id="notify" style="text-align: left; margin-bottom:10px;"></div>
          <form>
            <div class="input-group">
            <input type="text" class="form-control" id="amount" aria-label="..." placeholder="amount">
            <div class="input-group-btn">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Currency Type <span class="caret"></span></button>
                <ul class="dropdown-menu dropdown-menu-right">
                <li>Ether</li>
                <li>Wei</li>
                <li>GWei</li>
                </ul>
            </div><!-- /btn-group -->
            </div><!-- /input-group -->
          </form>
          <button class="btn btn-default" style="margin-top:15px;" id="bid">
                Submit
            </button>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>
